<template>
  <div>
    <el-container>
      <Aside></Aside>
      <el-container>
        <el-header style="height: 80px">
          <el-button @click="toRouter('/user')" style="margin-top: 20px;">个人中心</el-button>
          <div class="userInfo">
            <i class="el-icon-circle-close" @click="exist"></i>
            <div class="adminName">{{ this.tabledata.name }}</div>
            <div class="demo-basic--circle">
             <!-- <div class="block">
                <el-avatar :size="50" :src="circleUrl"></el-avatar>
              </div>-->
            </div>
          </div>
        </el-header>
        <Main></Main>
      </el-container>
    </el-container>
  </div>
</template>
<script>
  import Aside from "../../components/home/Aside";
  import Main from "../../components/home/Main";
  import { removeAccessToken,removeRole,removeuserName,getuserName } from "../../utils/cacheProcessing"
  import {getBasicInfo} from "../../api/list";
  export default {
    name: "administrator",
    components: {
      Aside,
      Main
    },
    data() {
      return {
        src:"",
        circleUrl:
          "https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png",
        tabledata: {
          name: localStorage.getItem("realName")
        },
        leveloneMenu:"一级菜单",
        leveltwoMenu:"二级菜单",
      };
    },

    created: function() {
      let requestData={
        username:getuserName(),
      }
      getBasicInfo(requestData).then(res=>{
        console.log(res);
        //this.src = "'http://47.115.62.124:8080/img/"+res.data.data.imgUrl
      })
    },
    methods: {
      exist() {
        this.confirm({
          content: "此操作将退出后台管理系统, 是否继续?",
          fn: ()=>{
            removeAccessToken()
            removeRole()
            removeuserName()
            this.$router.push('/home')
          },
          catchfn: () => {}
        });
      },
      toRouter(name){
        this.$router.push(name);
      }
    },
  };
</script>
<style lang="scss" scoped>
  .userInfo {
    float: right;
  }
  .box-card {
    float: left;
    background-color: rgba(63,63,63,0.8);

    .bread {
      width: 400px;
      display: flex;
      font-size: 20px;
    }
  }
  .demo-basic--circle {
    width: 20px;
    float: right;
    margin-right: 50px;
    margin-top: 0px;
    padding-bottom: 0px;
  }
  .header_item{
    display: inline-block;
    margin-top: 20px;
    font-size: 25px;
    color: #7c7e81;
  }
  .adminName {
    float: right;
    margin-right: 20px;
    margin-top: 25px;
  }
  .el-icon-circle-close {
    float: right;
    margin-right: 20px;
    margin-top: 25px;
    font-size: 25px;
    cursor: pointer;
  }
  .clearfix:after {content: "."; display: block; height:0; clear:both; visibility: hidden;}
  .clearfix { *zoom:1; }



  //顶部导航栏图标的颜色
  .el-header,
  .el-footer {
    // margin: 2px;
//    background-color: #3498db;
    background-color: rgba(63,63,63,0.8);
    margin: 10px;
    color: #fff;
    //width: 100%;
  }
.userCover{
  display: inline-block;
  overflow: hidden;
  top: 0;
  width: 70px;
  height: 70px;
  background-color: #333333;
  border-radius: 35px;
  cursor: pointer;
}
</style>
